<ui:composition template="index.xhtml"
	xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets">

	<ui:define name="content">
		<h3 id="title-doc">
			<a href="" data-reveal-id="dlg-new" class="icon-plus"></a> |
			Documentos
		</h3>

		<p:dataTable id="dataTable" var="document"
			value="#{documentBean.documents}" paginator="true" rows="25"
			paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
			rowsPerPageTemplate="25, 50, 75, 100">

			<p:column>
				<f:facet name="header">
					<h:outputText value="Título" />
				</f:facet>
				<h:outputText value="#{document.title}" />
			</p:column>
			<p:column>
				<f:facet name="header">
					<h:outputText value="Tipo" />
				</f:facet>
				<h:outputText value="#{document.type}" />
			</p:column>
			<p:column>
				<f:facet name="header">
					<h:outputText value="Licença" />
				</f:facet>
				<h:outputText value="#{document.licence}" />
			</p:column>

			<p:column>
				<f:facet name="header">
					<h:outputText value="Ações" />
				</f:facet>
				<span data-reveal-id="dlg-update"> <p:commandButton
						actionListener="#{documentBean.select}" value="Alterar"
						update="@(#form-update)" process="dataTable" />
				</span>
				<p:commandButton action="#{documentBean.delete}"
					actionListener="#{documentBean.select}" value="Excluir"
					update="dataTable" process="dataTable" />
			</p:column>
		</p:dataTable>
	</ui:define>

	<!-- Dialogs -->
	<ui:define name="dialogs">
		<div id="dlg-new" class="reveal-modal medium">
			<a class="close-reveal-modal">&#215;</a>
			<h3>Adicionar Documento</h3>

			<h:form id="form-new">
				<p:messages id="msg-new" autoUpdate="true" closable="true"
					showDetail="false" />

				<h:outputText for="new-title" value="Título" />
				<p:inputText id="new-title" value="#{documentBean.document.title}"
					required="true" requiredMessage="Favor informar o título" />

				<h:outputText for="new-type" value="Tipo" />
				<h:selectOneMenu id="new-type" value="#{documentBean.docType}"
					effect="fade" required="true"
					requiredMessage="Favor informar o tipo">
					<f:selectItem itemLabel="Selecione" itemValue="" />
					<f:selectItems value="#{documentBean.docTypes}" />
				</h:selectOneMenu>

				<h:outputText for="new-licence" value="Licença" />
				<h:selectOneMenu id="new-licence" value="#{documentBean.docLicence}"
					effect="fade" required="true"
					requiredMessage="Favor informar a licença">
					<f:selectItem itemLabel="Selecione" itemValue="" />
					<f:selectItems value="#{documentBean.docLicences}" />
				</h:selectOneMenu>

				<h:outputText for="new-tags" value="Tags" />
				<p:autoComplete id="new-tags" value="#{documentBean.tags}"
					autocomplete="true" completeMethod="#{tagBean.autoComplete}"
					multiple="true" />

				<h:outputText for="new-description" value="Descrição" />
				<p:inputTextarea id="new-description"
					value="#{documentBean.document.description}" required="true"
					requiredMessage="Favor informar a descrição" />

				<p:commandButton actionListener="#{documentBean.save}"
					oncomplete="validateForm(xhr, status, args, 'dlg-new')"
					value="Salvar" update="form-new" process="form-new" />
				<p:button value="Cancelar" />
			</h:form>
		</div>

		<div id="dlg-update" class="reveal-modal medium">
			<a class="close-reveal-modal">&#215;</a>
			<h3>Alterar Documento</h3>

			<h:form id="form-update">
				<p:messages id="msg-update" autoUpdate="true" closable="true"
					showDetail="false" />

				<h:outputText for="update-title" value="Título" />
				<p:inputText id="update-title"
					value="#{documentBean.document.title}" required="true"
					requiredMessage="Favor informar o título" />

				<h:outputText for="update-type" value="Tipo" />
				<h:selectOneMenu id="update-type" value="#{documentBean.docType}"
					effect="fade" required="true"
					requiredMessage="Favor informar o tipo">
					<f:selectItem itemLabel="Selecione" itemValue="" />
					<f:selectItems value="#{documentBean.docTypes}" />
				</h:selectOneMenu>

				<h:outputText for="update-licence" value="Licença" />
				<h:selectOneMenu id="update-licence"
					value="#{documentBean.docLicence}" effect="fade" required="true"
					requiredMessage="Favor informar a licença">
					<f:selectItem itemLabel="Selecione" itemValue="" />
					<f:selectItems value="#{documentBean.docLicences}" />
				</h:selectOneMenu>

				<h:outputText for="update-tags" value="Tags" />
				<p:autoComplete id="update-tags"
					value="#{documentBean.tags}" autocomplete="true"
					completeMethod="#{tagBean.autoComplete}" multiple="true" />

				<h:outputText for="update-description" value="Descrição" />
				<p:inputTextarea id="update-description"
					value="#{documentBean.document.description}" required="true"
					requiredMessage="Favor informar a descrição" />

				<p:commandButton actionListener="#{documentBean.update}"
					oncomplete="validateForm(xhr, status, args, 'dlg-update')"
					value="Salvar" update="form-update" process="form-update" />
				<p:button value="Cancelar" />
			</h:form>
		</div>
	</ui:define>

</ui:composition>